/**
 * Created with JetBrains PhpStorm.
 * User: jiangshuguang
 * Date: 14-10-28
 * Time: 下午5:50
 * To change this template use File | Settings | File Templates.
 */

var createUi = require("common:widget/ui/base/base.js").createUi;

exports.Dialog = createUi({
    _data:{
        title:'提示',
        open:false,
        content:'',
        width:400,
        confirmBtn:false,
        cancelBtn:true,
        confirmBtnText:'确定',
        cancelBtnText:'取消',
        onCancel:function(){},
        onConfirm:function(){}
    },

    _create:function(){
        var tpl = __inline('./dialog.tmpl');
        var gid = this.getGid(),
            html = tpl({gid:gid});

        $('body').append(html);

        var $root = $("#"+gid),
            $container = $root.find('.dialog-container'),
            $dialogHeader = $container.find('.dialog-header'),
            $dialogContent = $container.find('.dialog-content'),
            $dialogFooter = $container.find('.dialog-footer');

        $container.css('width',this.data("width"));
        this.data('confirmBtn') && $dialogFooter.append('<a class="btn btn-main  btn-confirm">'+this.data('confirmBtnText')+'</a>');
        this.data('cancelBtn') && $dialogFooter.append('<a class="btn btn-cancel">'+this.data('cancelBtnText')+'</a>');
        $dialogFooter.append('<div class="clear"></div>');
        $dialogHeader.find('.dialog-title').text(this.data('title'));
        $dialogContent.append(this.data('content'));


        this.data({
            '$root':$root,
            '$container':$container,
            '$dialogHeader':$dialogHeader,
            '$dialogContent':$dialogContent,
            '$dialogFooter':$dialogFooter
        })
    },

    _init:function(){
        var me = this,
            $dialogFooter = this.data('$dialogFooter'),
            $root = this.data("$root"),
            $dialogHeader = this.data("$dialogHeader");
        $dialogHeader.find('.dialog-close').click(function(){
            me.hide();
        });

        $dialogFooter.find('.btn-cancel').click(function(){
            me.trigger('cancel');
            me.hide();
        });

        $dialogFooter.find('.btn-confirm').click(function(){
            me.trigger('confirm',function(){
                me.hide();
            });
        })
    },

    setTitle:function(title){
        this.data("$dialogHeader").find('.dialog-title').text(title);
    },

    show:function(content){
        var $root = this.data("$root"),
            $container = this.data('$container');
        content && $root.find(".dialog-content").html(content);
        $root.show();
        $container.show();
        var width = $container.width(),
            height = $container.height();
        $container.css({
            'margin-left':"-"+(width/2)+"px",
            'margin-top':"-"+(height/2)+"px"
        });
        $container.hide();
        $container.css({
            'transition':'all 0.3s ease'
        });
        $container.show();
        $container.removeClass('init');
    },

    hide:function(){
        this.data("$root").hide();
        this.data('$container').addClass('init').css({
            'transition':'none'
        });
    }
});
